"use client";

import Link from "next/link";
import { usePathname } from "next/navigation";
import "./style.css";

const navLink = [
  {
    name: "登录",
    href: "/login",
  },
  {
    name: "注册",
    href: "/register",
  },
];

export default function AuthLayout({ children }) {
  const pathname = usePathname();
  return (
    <>
      <label htmlFor='input'>输入框：</label>
      <input id='input' type='text' />
      <div>{navLink.map(link => {
        const isActive = pathname === link.href ? 'active' : ""
        return (
          <span key={link.name}>
            <Link className={isActive} href={link.href}>{link.name}</Link>&nbsp;&nbsp;
          </span>
        )
      })}</div>
      {children}
    </>
  );
}
